<%@page import="com.z.base.BaseAction"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <%@include file="/include/meta.jsp"%>
    <base href="<%=basePath%>">
	<title>在线图书馆</title>
	<link rel="stylesheet" type="text/css" href="css/default.css" />
	
	<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
	<link rel="stylesheet" type="text/css" href="js/fancyBox/source/jquery.fancybox.css" />
	<script type="text/javascript" src="js/fancyBox/source/jquery.fancybox.pack.js"></script>
	<link rel="stylesheet" type="text/css" href="js/jqPagination/jqpagination.css" />
	<script type="text/javascript" src="js/jqPagination/jquery.jqpagination.min.js"></script>
	
	<style>
		table.docList{
			width:100%;
		}
		
		table.docList thead tr{
			font-size:16px;
			background-color: lime;
		}
		
		.pagination a{
		    height:22px;
		}
	</style>
	
	<script type="text/javascript">
		function page_first(){
			var pn=$("#pageNo").val();
			if(pn==1){
				return;
			}
			query(1);
		}
		
		function page_last(){
			var pn=$("#totalPages").val();
			if($("#pageNo").val()==$("#totalPages").val()){
				return;
			}
			query(pn);
		}
				
		function page_previous(){
			var pn=Number($("#pageNo").val());
			if(pn>1){
				query(pn-1);
			}
			
		}
		
		function page_next(){
			var pn=Number($("#pageNo").val());
			if(pn<$("#totalPages").val()){
				query(pn+1);
			}
		}
		
		function see(id){
			alert(id);
		}
		
		function displayAccountName(){
			if($(".accountName").length>0){
		        var maps=[];
		        $(".accountName").each(function(){
		            var target=$(this).attr("accountId");
		            if($.inArray(target,maps)>=0)return;
		            maps.push(target);
		            showPersonName(target);
		        });
		    }
		}
		
		function showPersonName(id){
			var action="register!queryName.action?id="+id+"&t="+new Date();

		    $.ajax({
		        url: action,
		        success:function(data){
		        		var txt="<label>"+data+"</label>";
		        		$(".accountName[accountId='"+id+"']").removeClass("accountName")
		        											  .removeAttr("accountId")
		        											  .append(txt);
		        }
		    });
		}
		
		function query(pageNo){
			var url='view!list.action?queryParam='+$("#queryParam").val();
			if(pageNo>0){
				url+="&page.pageNo="+pageNo;
			}
			$.ajax({
				url: url,
				success: function(data) {
					$("#list").html("");
					$("#pageNo").val(data.pageNo);
					$("#totalPages").val(data.totalPages);
					$("#infoLabel").val(data.pageNo+"/"+data.totalPages+"页   共"+data.totalCount+"条记录");
					if(data.list.length==0){
						$("#list").html("<tr><td colspan='3'>无任何文档记录</td></tr>");
						return;
					}
					for(var i=0;i<data.list.length;i++){
						var x="<tr>";
						x+="<td style='text-align: center'>"+((data.pageNo-1)*data.pageSize+i+1)+"</td>";
						x+="<td><a class='fancybox fancybox.iframe' href='view!display.action?docId="+data.list[i].id+"' title='"+data.list[i].summary+"'>"+data.list[i].name+"</a></td>";
						x+="<td><label class='accountName' accountId='"+data.list[i].uploadBy+"'></label></td>";
						x+="<td>"+data.list[i].uploadTime+"</td>";
						if($('#operationTh').size()>0){
							x+="<td><a href=\"javascript:;\" onclick=\"dodelete('"+data.list[i].id+"');\">delete</a></td>";
						}
						x+="</tr>";
						$("#list").append(x);
					}
					
					displayAccountName();
				}
			});
		}
		
		function dodelete(id){
			var url='view!delete.action?docId='+id;
			$.ajax({
				url: url,
				success: function(data) {
					query($("#pageNo").val());
				}
			});
		}
		
		$(function(){
			query(0);
			$('.fancybox').fancybox();
			$('.fancybox2').fancybox({
				width:500,
				'afterClose':function(){
					window.location.reload();
				 }
			});
			$('.fancybox3').fancybox({
				width:300,
				'afterClose':function(){
					window.location.reload();
				 }
			});
		});
	</script>
</head>
<body>
	<div style="height:60px;background-color: #DDDDDD;">
		<div id="uploadArea" style="text-align: right;">
			<s:if test="#session.loginUserSessionId!=null">
				您好，<a href="#"><s:property value="#session.loginUserSessionId.usrName"/></a>&nbsp;
				<a class="fancybox fancybox.iframe" href="view!add.action">上传</a>
			</s:if>
			<s:else>
				<a class="fancybox3 fancybox.iframe" href="authentication.action">登陆</a>
				<a class="fancybox2 fancybox.iframe" href="register.action">注册</a>
			</s:else>
			
		</div>
		<div id="searchArea" style="text-align: right;">
			<input type="text" id="queryParam" name="queryParam" />
			<input type="button" value="搜索" onclick="query();" />
		</div>
	</div>
	<div>
		
	</div>
	<table class="docList">
		<thead>
			<tr>
				<th width="40px" style="text-align: center">序号</th>
				<th>名称</th>
				<th width="100px">上传人</th>
				<th width="200px">上传时间</th>
				<s:if test="#session.loginUserSessionId!=null&&#session.loginUserSessionId.manager">
				<th id='operationTh' width="60px">操作</th>
				</s:if>
			</tr>
		</thead>
		<tbody id="list">
		</tbody>
	</table>
	<div>
		<div class="gigantic pagination" style="position: absolute;right: 2px">
			<input type="hidden" id="pageNo" />
			<input type="hidden" id="totalPages" />
		    <a href="javascript:page_first();" class="first">&laquo;</a>
		    <a href="javascript:page_previous();" class="previous">&lsaquo;</a>
		    <input id="infoLabel" type="text" readonly="readonly" />
		    <a href="javascript:page_next();" class="next">&rsaquo;</a>
		    <a href="javascript:page_last();" class="last">&raquo;</a>
		</div>
	</div>
</body>
</html>